<template>
	<view class="content">
		<u-navbar leftIconColor="#000" :autoBack="true" :placeholder="true" bgColor="rgba(255,255,255,0.0)">
			<view slot="center" class="nav-title">
				{{title}}
			</view>
		</u-navbar>
		<view class="info-box">
			<view class="info-item">
				<view class="info-title">
					收件人
				</view>
				<view class="input">
					<u--input placeholder="姓名" border="none" v-model="name" placeholderStyle="color:'#999'"
						color="#000000"></u--input>
				</view>

			</view>
			<view class="info-item">
				<view class="info-title">
					电话
				</view>
				<view class="input">
					<u--input placeholder="手机号码" border="none" v-model="tell" placeholderStyle="color:'#999'"
						color="#000000" maxlength="11" type="number"></u--input>
				</view>
			</view>
			<view class="info-item">
				<view class="info-title">
					地区
				</view>
				<view class="input">
					<u--input placeholder="北京市,北京市,东城区" border="none" v-model="region" placeholderStyle="color:'#999'"
						color="#000000"></u--input>
				</view>
			</view>
			<view class="info-item">
				<view class="info-title">
					详细地址
				</view>
				<view class="input">
					<u--input placeholder="街道、小区、楼栋号、单元室等" border="none" v-model="address"
						placeholderStyle="color:'#999'" color="#000000"></u--input>
				</view>
			</view>
			<view class="info-item end">
				<view class="info-title">
					默认地址
				</view>
				<u-switch v-model="value" inactiveColor="#d6d6d6" activeColor="#FD5674"></u-switch>
			</view>
		</view>

		<view class="btn">
			<u-button size="large" @click="goadd" class="btn-color" shape="circle" color="#000000" type="primary"
				text="提交"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: '',
				name: '',
				tell: '',
				region: '',
				address: '',
				value: false,
				title: '',
				num: 1
			}
		},
		onLoad(e) {
			this.num = e.num
			if (e.num == 1) {
				this.title = '新增地址'
			} else {
				this.title = '编辑地址'
				let info = JSON.parse(decodeURIComponent(e.item))
				this.id = info.id
				this.name = info.name
				this.tell = info.tel
				this.region = info.address_detail
				this.address = info.address_all
				this.value = info.status == 1 ? true : false
			}
		},
		methods: {
			goadd() {
				if (this.name == '') {
					uni.showToast({
						title: '收件人不能为空！',
						icon: 'none'
					})
					return
				}
				if (this.tell == '') {
					uni.showToast({
						title: '手机号码不能为空！',
						icon: 'none'
					})
					return
				}
				if (this.region == '') {
					uni.showToast({
						title: '地区不能为空！',
						icon: 'none'
					})
					return
				}
				if (this.address == '') {
					uni.showToast({
						title: '详细地址不能为空！',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					mask: true
				})
				if (this.num == 1) {
					this.$Request({
						method: 'POST',
						url: '/api/shop/addressAdd',
						data: {
							tel: this.tell,
							name: this.name,
							status: this.value == true ? 1 : 0,
							address_detail: this.region,
							address_all: this.address

						}
					}).then(res => {
						uni.hideLoading()
						if (res.code == 1) {
							uni.showToast({
								title: '添加成功！',
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 1000)
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					})
				} else {
					this.$Request({
						method: 'POST',
						url: '/api/shop/addressEditPost',
						data: {
							id: this.id,
							tel: this.tell,
							name: this.name,
							status: this.value == true ? 1 : 0,
							address_detail: this.region,
							address_all: this.address
						}
					}).then(res => {
						uni.hideLoading()
						if (res.code == 1) {
							uni.showToast({
								title: '修改成功！',
								icon: 'none'
							})
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 1000)
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					})
				}

			}
		}
	}
</script>
<style>
	page {
		background-color: #f8f8f8;
	}

	.btn-color {
		color: #ffffff !important;
		font-weight: bold;
	}
</style>
<style lang="scss" scoped>
	.content {
		min-height: 100vh;
		padding: 30rpx;
		background-image: url('../../../static/home/home-bg.png');
		background-repeat: no-repeat;
		background-size: 100% 500rpx;
		.end {
			display: flex;
			align-items: center;
			justify-content: space-between;
			margin-bottom: 0;
			padding-top: 20rpx;
		}
		
		.info-box {
			background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 7.45%, #FFFFFF 58.5%);
			border: 1px solid #FFFFFF;
			padding: 30rpx;
			opacity: 0.9;
			border-radius: 20rpx;
		}

		
		.info-item {
			margin-bottom: 30rpx;

			.info-title {
				font-size: 28rpx;
				font-weight: bold;
			}

			.input {
				padding: 20rpx;
				background-color: #eee;
				margin-top: 20rpx;
				border-radius: 10rpx;
			}

		}

		.btn {
			margin-top: 80rpx;

		}
	}
</style>